<template>
    <div>
      <titleTop :titleTxet="titleTxet"></titleTop>

      <div
        v-for="(item,index) in navList"
        :key="index"
        class="list_box"
      >
        <div
          class="container p_t40 p_d40 flex f_align f_bet w1"
          @click="nextTo(item.listTapUrl)"
        >
          <div class="flex">
            <div class="img_box m_r30">
              <img
                :src="item.listImg"
                alt=""
                :class="item.listName"
              >
            </div>
            <div class="font_28 c_28">
              <span>{{item.listTxt}}</span>
            </div>
          </div>
          <div>
            <img
              src="../../../assets/img/more.png"
              alt=""
              class="more"
            >
          </div>
        </div>
      </div>
    </div>
</template>

<script>
  import titleTop from "../../com/title";
    export default {
      components: { titleTop },
      name: "Siting",
      data(){
        return {
          titleTxet: {
            titleName: "设置",
            IsBool: true,
            IsShare: false
          },
          navList: [
            {
              listTxt: "意见反馈",
              listImg: require("../../../assets/img/idea.png"),
              listName: "idea",
              listTapUrl: "/myidea"
            },
            {
              listTxt: "版本信息",
              listImg: require("../../../assets/img/versions.png"),
              listName: "versions",
              listTapUrl: "/myVersions"
            },
            {
              listTxt: "关于我们",
              listImg: require("../../../assets/img/about.png"),
              listName: "about",
              listTapUrl: "/myAbout"
            }
          ]
        }
      },
      methods:{
        nextTo(url) {
          this.$router.push({ path: url });
        }
      }
    }
</script>

<style scoped>
  .img_box {
    width: 50px;
  }
  .list_box > div {
    border-bottom: 2px solid #cdcdcd;
  }
  .idea {
    width: 36px;
    height: 36px;
  }
  .versions {
    width: 40px;
    height: 40px;
  }
  .about {
    width: 40px;
    height: 40px;
  }
</style>
